body{ margin:0; background:url(../images2018/bg.jpg) 50% 0 fixed; background-size:cover}
td,div,li,select,input,textarea{ font:12px/22px songti; color:#9aafcb;}
input{ line-height:1.3; color:#333}
input[type=submit],input[type=reset],input[type=button],input[type=text]{-webkit-appearance:none;}
a{ color:#9aafcb; text-decoration:none}
a:hover{ color:#fff; text-decoration:underline}
ul{ list-style-type:none; padding:0; margin:0}
img{ border:0;}
.clear{ clear:both; font-size:0; line-height:0; height:0}

.logo{ width: 727px; margin: auto; padding: 40px 0 20px}
#menu{ margin: 0 0 30px}


#footer,#cfooter{ font:14px/24px microsoft yahei; width:960px; margin:auto; position:relative; padding: 0 0 30px}
#cfooter{ width: 680px}
#mfooter{ display: none}
.wrap{ width: 960px; margin: auto}
.cmain{ padding: 30px 100px; background: #2877d4 }

.cnlist ul li{ background:url(../images2018/dot.gif) no-repeat 5px 22px; font:16px/22px microsoft yahei; border-bottom:1px dashed #a7bacb; padding:12px 0 12px 15px; overflow: hidden}
.cnlist ul li span{ display:block; float:right; font-size:12px; color: #9dc1e2}
.cnlist ul li a{ color: #fff}
.cnlist div{ margin:25px 0 15px; font-size:14px; color: #fff}
.cnlist div a{ color: #fff}
.ptitle{ border-bottom:2px solid #48d9ff; height:36px; position:relative; margin:0 0 20px}
.ptitle div{ position:absolute; background:#2877d4; padding:0 4px 0 0 }
.ptitle div span{ display:block; height:36px; border-bottom:2px solid #fff; padding:0 8px; font:18px/36px microsoft yahei; color:#fff; margin:0 0 20px;}

.ntitle{ font: 36px/42px microsoft yahei; color: #fff; margin: 0 0 10px; text-align: center}
.nstitle{ font: 30px/36px microsoft yahei; margin: 0 0 15px; color: #9dc1e2; text-align: center}
.bcontent{ font: 18px/180% microsoft yahei; min-height: 400px; color: #fff;  }
.bcontent p{ margin:0 0 28px;}
.bcontent p span{ display:block; margin:-10px 0 0}
.bcontent table {border-collapse:collapse;}
.ninfo{ margin: 0 0 30px; color: #9dc1e2; font-size: 14px; text-align: center}

.back{ position: absolute; top: 0; left: 50%; width: 300px; margin:0 0 0 180px; background: #2877d4; overflow: hidden; padding: 10px 0}
.back a{ display: block; float: left; color: #fff; margin: 0 20px; height: 28px; font: 14px/28px microsoft yahei; border-right: 1px solid #48d9ff; padding:  0 20px 0 0}
.search{ float: left; width: 156px; height: 28px;  padding: 0 5px; background: #fff; }
.search form{ margin: 0}
.inputtxt{ float: left; border: 0; height:26px; line-height: 26px; width: 130px; color: #999 }
.inputbtn{ float: right;}
.insearch{ position: absolute; top: 0; left: 50%; width: 182px; margin:0 0 0 240px; overflow: hidden; width: 240px}
.iisearch{ width: 154px; height: 28px;  padding: 0 5px; background: #fff; display: none}
.iisearch form{ margin: 0}
.sb-search{ display: none}

.bottombox{ background:#2877d4; padding:20px 0; width: 960px; margin: 0 auto 25px; border-top: 5px solid #234e90}
.tips{ margin:0 0 18px}
.tips ul{ overflow:hiddena}
.tips ul li{ float:left; margin:0 1.5%; width:17%; text-align:center; font:14px/20px microsoft yahei; color:#134f91; padding:45px 0 0; position:relative}
.tips ul li.al{ padding:0}
.tips ul li a{ display:block; width:70px; padding:45px 0 0; height:100%; margin:auto; color:#134f91}
.tips ul li a:hover{ color:#134f91; text-decoration:none}
.tips ul li a#qrbtn{ position:relative}
#qrcode{ width:120px; height:124px; position:absolute; top:-120px; left:-28px; z-index:1000; display:none}

.tips ul li.i1{ background:url(../images2018/i1.png) no-repeat 50% 0}
.tips ul li.i1 a{ color: #3bd531}
.tips ul li.i2{ background:url(../images2018/i2.png) no-repeat 50% 0}
.tips ul li.i2 a{ color: #ffde00}
.tips ul li.i3{ background:url(../images2018/i3.png) no-repeat 50% 0}
.tips ul li.i3 a{ color: #ff6a10}
.tips ul li.i4{ background:url(../images2018/i4.png) no-repeat 50% 0; position:relative; color: #d00e6e}
.tips ul li.i4 a.bds_more{ display:block; width:50px; height:15px; position:absolute; top:0px; left:50%; margin-left:-30px; background:none;}
.tips ul li.i5{ background:url(../images2018/i5.png) no-repeat 50% 0}
.tips ul li.i5 a{ color: #7c008f}
.links ul{ overflow: hidden}
.links ul li{ width:200px; margin:0 20px; padding:4px 0; font:14px/20px microsoft yahei; float: left; background: #fff; text-align: center}
.links ul li a{ color: #2c4d8f}

.clmain{ padding:20px 40px 30px; background: #2877d4}


.ca-menu li.l1{ background: #3598db; width: 320px}
.ca-menu li.l2{ background: #3dcf7a;}
.ca-menu li.l3{ background: #f3c100;}
.ca-menu li.l4{ background: #a62eaa;}
.ca-menu li.l5{ background: #3d47da;}
.ca-menu li.l6{ background: #f39500}
.ca-menu li.l7{ background: #3a30a3;}
.ca-menu li.l8{ background: #5321a8;}
.ca-menu li.l9{ background: #ef2475;}
.ca-menu li.l10{ background: #3d47da;}
.ca-menu li.l11{ background: url(../images2018/ft.jpg);}
.ca-menu li.l11 img{ visibility: hidden}
.ca-menu li.l12{ background: #1cc1a1}
.ca-menu li.l13{ background: #78a517}
.ca-menu li.l14{ background: #808080}
.ca-menu li.l15{ background: #3a30a3}
.ca-menu li.l16{ width: 320px; background: url(../images2018/dt.jpg);}
.ca-menu li.l16 img{ visibility: hidden;}


.ca-menu {
  padding: 0;
  auto;
  width: 960px;
  margin: auto;
}

.ca-menu li {
  width: 160px;
  height: 160px;
  overflow: hidden;
  position: relative;
  float: left;
  background: #fff;


  -webkit-transition: all 300ms linear;
  -moz-transition: all 300ms linear;
  -o-transition: all 300ms linear;
  -ms-transition: all 300ms linear;
  transition: all 300ms linear
}


.ca-menu li a {
  text-align: left;
  width: 100%;
  height: 100%;
  display: block;
  color: #333;
  position: relative
}

.ca-icon {
  
  position: absolute;
  width: 92%;
  height: 30%;
  left: 8%;
  top: 10%;
  -webkit-transition: all 400ms linear;
  -moz-transition: all 400ms linear;
  -o-transition: all 400ms linear;
  -ms-transition: all 400ms linear;
  transition: all 400ms linear
}
.ca-icon img{ width: 56px;
 -webkit-transition: all 400ms linear;
  -moz-transition: all 400ms linear;
  -o-transition: all 400ms linear;
  -ms-transition: all 400ms linear;
  transition: all 400ms linear
}
.ca-icon#heart {
  color: #f7002f;
  text-shadow: 0 0 1px #f7002f
}

.ca-content {
  position: absolute;
  left: 8%;
  width: 84%;
  height: 42%;
  top: 44%;-webkit-transition: all 200ms linear;
  -moz-transition: all 200ms linear;
  -o-transition: all 200ms linear;
  -ms-transition: all 200ms linear;
  transition: all 200ms linear
}

.ca-main {
  color: #fff;
  font-size: 16px;
  opacity: .8;
  margin: 0 0 4px;
  font-weight: normal;
  -webkit-transition: all 200ms linear;
  -moz-transition: all 200ms linear;
  -o-transition: all 200ms linear;
  -ms-transition: all 200ms linear;
  transition: all 200ms linear
}
li.l3 .ca-main{ font-size: 14px; margin: 0}
li.l3 .ca-sub{ font-size: 12px}
.ca-sub {
  font-size: 13px;
  color: #fff;
  margin: 0;
  line-height: 16px;
  width: 100%;
  font-weight: normal;
  opacity: .8;
  -webkit-transition: all 200ms linear;
  -moz-transition: all 200ms linear;
  -o-transition: all 200ms linear;
  -ms-transition: all 200ms linear;
  transition: all 200ms linear
}

.ca-menu li:hover {
  background-color: #002c74;
  z-index: 999;
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -o-transform: scale(1.1);
  transform: scale(1.1)
}

.ca-menu li:hover .ca-icon {
  color: #ffd800;
  font-size: 90px;
  opacity: .3;
  top:3%
}
.ca-menu li:hover .ca-icon img{ width: 78px; -webkit-transition: all 400ms linear;
  -moz-transition: all 400ms linear;
  -o-transition: all 400ms linear;
  -ms-transition: all 400ms linear;
  transition: all 400ms linear }

.ca-menu li:hover .ca-icon#heart {
  -webkit-animation: smallToBig 900ms alternate infinite ease;
  -moz-animation: smallToBig 900ms alternate infinite ease;
  -ms-animation: smallToBig 900ms alternate infinite ease
}

.ca-menu li:hover .ca-main {
  color: #ffd800;
  -webkit-animation: smallToBig 300ms ease;
  -moz-animation: smallToBig 300ms ease;
  -ms-animation: smallToBig 300ms ease
}
.ca-menu li:hover .ca-content {
  top: 50%;-webkit-transition: all 200ms linear;
  -moz-transition: all 200ms linear;
  -o-transition: all 200ms linear;
  -ms-transition: all 200ms linear;
  transition: all 200ms linear
}
.ca-menu li:hover .ca-sub {
  color: #ffd800;
  -webkit-animation: moveFromBottom 500ms ease;
  -moz-animation: moveFromBottom 500ms ease;
  -ms-animation: moveFromBottom 500ms ease
}

@-webkit-keyframes smallToBig {
  from {
    -webkit-transform: scale(.1)
  }
  to {
    -webkit-transform: scale(1)
  }
}

@-moz-keyframes smallToBig {
  from {
    -moz-transform: scale(.1)
  }
  to {
    -moz-transform: scale(1)
  }
}

@-ms-keyframes smallToBig {
  from {
    -ms-transform: scale(.1)
  }
  to {
    -ms-transform: scale(1)
  }
}

@-webkit-keyframes moveFromBottom {
  from {
    -webkit-transform: translateY(100%)
  }
  to {
    -webkit-transform: translateY(0%)
  }
}

@-moz-keyframes moveFromBottom {
  from {
    -moz-transform: translateY(100%)
  }
  to {
    -moz-transform: translateY(0%)
  }
}

@-ms-keyframes moveFromBottom {
  from {
    -ms-transform: translateY(100%)
  }
  to {
    -ms-transform: translateY(0%)
  }
}
.sb-search { display: block;
  position: relative;
  margin-top: 10px;
  width: 0%;
  min-width: 40px;
  height: 40px;
  float: right;
  overflow: hidden;
  -webkit-transition: width .3s;
  -moz-transition: width .3s;
  transition: width .3s;
  -webkit-backface-visibility: hidden
}

.sb-search-input {
  position: absolute;
  top: 0;
  right: 0;
  border: 0;
  outline: 0;
  background: #fff;
  width: 100%;
  height: 40px;
  margin: 0;
  z-index: 10;
  padding: 10px 65px 10px 10px;
  font-family: inherit;
  font-size: 14px;
  color: #2c3e50;
  box-sizing: border-box
}

.sb-search-input::-webkit-input-placeholder {
  color: #999
}

.sb-search-input:-moz-placeholder {
  color: #999
}

.sb-search-input::-moz-placeholder {
  color: #999
}

.sb-search-input:-ms-input-placeholder {
  color: #999
}

.sb-icon-search,
.sb-search-submit {
  width: 40px;
  height: 40px;
  display: block;
  position: absolute;
  right: 0;
  top: 0;
  padding: 0;
  margin: 0;
  line-height: 40px;
  text-align: center;
  cursor: pointer
}

.sb-search-submit {
  background: #fff;
  -ms-filter: "alpha(opacity=0)";
  filter: alpha(opacity=0);
  opacity: 0;
  color: transparent;
  border: 0;
  outline: 0;
  z-index: -1
}

.sb-icon-search {

  background: #2877d4;
  z-index: 90;
  speak: none;
  text-transform: none;
  -webkit-font-smoothing: antialiased;
  padding: 5px 0 0
}
.sb-icon-search img{ width: 50%}



.sb-search.sb-search-open,
.no-js .sb-search {
  width: 100%
}

.sb-search.sb-search-open .sb-icon-search,
.no-js .sb-search .sb-icon-search {
  background: #2c85ee;
  color: #fff;
  z-index: 11
}

.sb-search.sb-search-open .sb-search-submit,
.no-js .sb-search .sb-search-submit {
  z-index: 90
}
/* for popular bottom.htm */
    .bdshare_popup_bottom,.bdshare_dialog_box,.bdshare_popup_bg,.bdshare_dialog_bg{ display: none}
    #_span_jiucuo{display:block; position:absolute; top:10px; right:0;}
    #_ideConac{ display:block; position:absolute; top:-2px; right:114px}

@media only screen and (max-width: 736px){

  .logo{ width: 90%; margin: 5% auto; padding: 0}
  .logo img{ width: 100%; height: auto}
  #footer,#cfooter{ display: none}
  #mfooter{ display: block; width: 90%; box-sizing: border-box; margin: auto; padding: 5% 0 5% 60px; font:14px/22px microsoft yahei; background: url(../images2018/flogo.png) no-repeat 0 50%; background-size: 50px;}
  #menu{ margin: 0}
  .ca-menu { width: 90%;}

  .ca-menu li { width: 33.3333%; height: 124px; }
  .ca-menu li.l1,.ca-menu li.l16{ width: 66.666%} 
  .ca-menu li .ca-icon img{ width: 40px;}
  .ca-menu li:hover .ca-icon img{ width: 40px;}
  .ca-main { font-size: 14px; line-height: 16px}
  .ca-sub{ font-size: 12px}
  .ca-menu li:hover {
  background-color: 
  z-index: 999;
  -webkit-transform: scale(1);
  }
  .wrap,.bottombox{ width: 92%; margin: auto}
  .clmain,.cmain{ padding: 4% 6%}
  .links ul li{ width:90%; margin:0 auto 4%; float: none; padding: 10px 0 }
  .tips ul li.al{ background-size: 45px; font-size: 12px; width: 19%; margin: 0.5%}
  .tips ul li.al a{ width: 100%}
  .back{ position: static; top: 0; left: 0; width: 92%; margin:0 auto 4%;}
  .back a{ display: block; float: left; color: #fff; margin: 0 5%; height: 28px; font: 14px/28px microsoft yahei; border-right: 1px solid #48d9ff; padding:  0 5% 0 0; box-sizing: border-box; width: 25%; text-align: center}
  .search{ float: left; width: 60%; height: 28px; box-sizing: border-box;  padding: 0 5px;  }
  .inputtxt{ width: 70%;}
  .ntitle{ font: 26px/30px microsoft yahei; margin: 0 0 10px}
  .nstitle{ font: 20px/26px microsoft yahei; margin: 0 0 15px;}
  .insearch{ position: static; width: 90%; padding: 10px 20px; box-sizing: border-box; margin: 0 auto 5%; background: #2877d4;}
  .iisearch{ width: 100%; box-sizing: border-box; display: block}
  .sb-search { display: none}
}



